<template>
  <div>
    首页
    <h1>state:{{$store.state.count}}</h1>
    <h1>getters:{{$store.getters.doubleCount}}</h1>
    <button @click="toMuChange">触发mutations</button>
     <button @click="toActionsChange">触发actions</button>
  </div>
</template>
<script setup>
// 使用vuex 在页面渲染 不变和vue2 相同
import {useStore} from 'vuex'
let store= useStore()//store--->代替了this.$store
// 在js中使用vuex的 state和getters 
console.log(store.state.count)
console.log(store.getters.doubleCount)
// 在js使用vuex的mutations 和actions
let toMuChange=()=>{
    store.commit("setCount",10)
}
//触发actions 
let toActionsChange=()=>{
  store.dispatch("actCount",20)
}
</script>